<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <link rel="stylesheet" href="blueprint/screen.css" type="text/css" media="screen, projection">
    <link rel="stylesheet" href="blueprint/print.css" type="text/css" media="print">
	 <link rel="stylesheet" href="blueprint/plugins/fancy-type/screen.css" type="text/css" media="screen, projection">
	 
	 <script language="javascript" type="text/javascript" src="js/jquery-1.4.3.min.js"></script>
	 <script language="javascript" type="text/javascript" src="js/jquery.msAccordion.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Checkout</title>
</head>

<style type="text/css">
.set1{

-moz-border-radius : 5px;
	-webkit-border-radius : 5px;
	border-radius : 5px;
}
.set2{
background-color:#FFC732;
-moz-border-radius : 5px;
	-webkit-border-radius : 5px;
	border-radius : 5px;
}

</style>

<body class="bg_back">

				<script language="javascript" type="text/javascript">
$(document).ready(function() {

						   $("#accordion3").msAccordion({defaultid:1, vertical:true});
						   $("#accordion4").msAccordion({defaultid:1, vertical:true, event:'mouseover'});
						   }
						   )
</script>

<div class="container">
<div class="span-24">
   <div class="span-6">
		<div class="logo">
			Your Logo
		</div>
   </div>
	<div class="span-18 last">
	<div id="navigasi"> 
		<ul>
		<li><a href="#">HOME</a></li>
		<li><a href="#">EVENT</a></li>
		<li><a href="#">ABOUT US</a></li>
		<li><a href="#">CONTACT US</a></li>
		</ul>
	</div>
	</div>
</div>


<div class="span-24">
		   
	 <div id="bottom_content">
		<div class="span-8">
			<div class="order_image_content">
				POSTER
			</div>
		</div>
		
		<div class="span-16 last">
			<div class="detail_content">
            
<h3>CHECKOUT</h3>
			<p>EVENT : SEMINAR NASIONAL</p>
            <table width="1" border="0" cellpadding="0">
              <tr>
                <th>No</th>
                <th>Kelas</th>
                <th>Jumlah</th>
                <th>Harga</th>

              </tr>
              <tr>
                <td>1</td>
                <td>Mahasiswa</td>
				<td>1</td>
                <td>Rp.200.000</td>
              </tr>
			  <tr>
                <td>2</td>
                <td>Umum</td>
				<td>1</td>
                <td>Rp.250.000</td>
              </tr>
			   <tr>
                <td></td>
				 <td></td>
                <td>TOTAL</td>
                <td>Rp.650.000</td>
              </tr>
            </table>
				<div id="accordion3" class="accordionWrapper">
				<div class="set set1">
					<div class="title"><div class="title_accor1">NON MEMBER CHECKOUT</div></div>
					<div class="content">
						<div class="content_accor">
							<form action="" method="post" class="login_form">
								<ul class="login">
								<h3>Data Diri</h3>
									<li class="login">
										<label class="text_form">Nama</label>
										<input type="text" name="user_login" class="text_form" size="30"value="">
									</li>
									<li class="login">
										<label class="text_form">Tanggal Lahir</label>
										<input type="text" name="user_password" class="text_form" size="30" value="DATEPICKER">
									</li>
									<li class="login">
										<label class="text_form">Jenis Kelamin</label>
										<input type="text" name="user_password" class="text_form" size="30" value="DROPDOWN">
									</li>
									<li class="login">
										<label class="text_form">No HP Aktif</label>
										<input type="text" name="user_password" class="text_form" size="30" value="DROPDOWN">
									</li>
									<li class="login">
										<label class="text_form">Alamat</label>
										<input type="text" name="user_password" class="text_form" size="30" value="TEXTAREA">
									</li>
									<li class="login">
										<label class="text_form">Provinsi</label>
										<input type="text" name="user_password" class="text_form" size="30" value="DROPDOWN AJAX">
									</li>
									<li class="login">
										<label class="text_form">Kabupaten</label>
										<input type="text" name="user_password" class="text_form" size="30" value="DROPDOWN AJAX">
									</li>
									<li class="login">
										<label class="text_form">Kodepos</label>
										<input type="text" name="user_password" class="text_form" size="30" value="">
									</li>
									<li class="login">
										<label class="text_form">Email</label>
										<input type="text" name="user_password" class="text_form" size="30" value="">
									</li>
									<li class="login">
										<label class="text_form">Password</label>
										<input type="password" name="user_password" class="text_form" size="30" value="">
									</li>
									<li class="login">
										<label class="text_form">Rekening Bank</label>
										<input type="text" name="user_password" class="text_form" size="30" value="DROPDOWN BANK">
									</li>
									<li class="login">
										<label class="text_form">Kode Marketing</label>
										<input type="text" name="user_password" class="text_form" size="30" value="DROPDOWN CLASS">
									</li>
									<li class="login">
										<label class="text_form">Masukan kode</label>
										<input type="text" name="user_password" class="text_form" size="30" value="CHAPTA">
									</li>
									<li class="login">
										<input type="submit" value="Kirim" class="big" > 
									</li>
									
								</ul>
						 
							</form>
						</div>
					</div>
				</div>
				<div class="set set2">
					<div class="title"><div class="title_accor2">MEMBER CHECKOUT</div></div>
					<div class="content">
						<div class="content_accor">
							<form action="" method="post" class="login_form">
								<ul class="login">
									<li class="login">
										<label class="login">Email</label>
										<input type="text" name="user_login" class="text_login" size="30"value="">
									</li>
									<li class="login">
										<label class="login">Password</label>
										<input type="password" name="user_password" class="text_login" size="30" value="">
									</li>
									<li class="login">
										<input type="submit" value="Login" class="big" >  <a href="#">Forgot your password</a>
									</li>
									
								</ul>
						 
							</form>
							
						</div>
					</div>
				</div>
				</div>
				

			
			</div>
		</div>
		
		
	 </div>
 
</div>


	


<div class="span-24">	
	<hr class="space">
		
	<div id="footer">
		  Your footer 
	</div>
</div>
</div>

</body>
</html>
